<template>
  <div id="app">
    <input type="file" @change="openFile($event)">

    <!--element重写提交按钮-->
    <el-table :data="students" height="600" border style="width: 100%">
      <el-table-column prop="time" label="time" width="180">
      </el-table-column>
      <el-table-column prop="srcip" label="srcip" width="180">
      </el-table-column>
      <el-table-column prop="dstip" label="dstip" width="180">
      </el-table-column>
      <el-table-column prop="siptype" label="siptype" width="180">
      </el-table-column>
      <el-table-column prop="callid" label="callid">
      </el-table-column>
    </el-table>
    <!--数据列表-->
    <el-row>
      <el-button type="primary" @click="exitdocument">退出</el-button>
    </el-row>
  </div>
</template>
<script>
import axios from 'axios';
export default {
  data() {
    return {
      students: [],
      text: '',
      texts: '',
      year: '',
      month: '',
      day: '',
      hours: '',
      minutes: '',
      seconds: ''
    }
  },
  methods: {
    //从后台拿数据
    getstudents() {
      axios.get('http://127.0.0.1:7001/clazz').then(res => {
        this.students = res.data;

        this.students.forEach((item) => {
          item.time = Number(item.time) * 1000;
          // 获取年份
          this.year = new Date(item.time).getFullYear();
          //获取月份，获取的月份比实际小1，所以需要+1
          this.month = new Date(item.time).getMonth() + 1;
          //获取日
          this.day = new Date(item.time).getDate();
          //获取时
          this.hours = new Date(item.time).getHours();
          //获取分
          this.minutes = new Date(item.time).getMinutes();
          if (this.minutes < 10) {
            this.minutes = '0' + this.minutes
          }
          //获取秒
          this.seconds = new Date(item.time).getSeconds();
          if (this.seconds < 10) {
            this.seconds = '0' + this.seconds
          }
          //组合格式为年-月-日 时：分：秒（2022-6-6 12:12:12）
          item.time = this.year + "-" + this.month + "-" + this.day + " " + this.hours + ":" + this.minutes + ":" + this.seconds;
        })
      })
    },
    //导入txt文件
    openFile(event) {
      this.input = event.target;
      this.reader = new FileReader();
      this.reader.onload = function () {
        if (this.result) {
          //显示文件内容
          console.log(typeof this.result);
          this.text = this.result;

          //处理数据
          this.text = this.text.trim().split('\n');
          this.text.push('');
          this.texts = this.text.map((item) => {
            item = item.trim();
            if (item != undefined) {
              return item += '\n';
            }
          });

          //传输数据到后台服务器
          axios.post('http://127.0.0.1:7001/clazz', {
            name: this.text
          }).then(() => {
            console.log('发送成功');
          });
        }
      };
      this.reader.readAsText(this.input.files[0]);
    },
    //退出界面
    exitdocument() {
      this.$router.push('/');
    },

  },

  created() {
    //从后台拿数据
    this.getstudents()
  },
  computed: {

  }
}
</script>
<style>
</style>
